<?php
#region CODE
use Gotcha\App\Framework\Controller;
use Modules\JasminumCalendar\Controllers\DefaultController;

$calendar = new DefaultController();
$framewotk = new Controller();
#endregion
?>
    <header>
        <h2>Dostępność sal</h2>
    </header>
    <div id="jasminum-calendar-legend">
        <div class="clearfix">
            <div class="pull-left">
                    <img src="<?= $framewotk->UrlContent('/Themes/Jasminum.Theme/Styles/Images/hall-1.jpg'); ?>">
                    Sala "Jaśmin" dostępna/zarezerwowana
            </div>
            <div class="pull-left">
                <img src="<?= $framewotk->UrlContent('/Themes/Jasminum.Theme/Styles/Images/hall-2.jpg'); ?>">
                Sala "VIP" dostępna/zarezerwowana
            </div>
        </div>
        <div class="clearfix">
            <div class="pull-left">
                <img src="<?= $framewotk->UrlContent('/Themes/Jasminum.Theme/Styles/Images/hall-3.jpg'); ?>">
                Sala "Forsycja" dostępna/zarezerwowana
            </div>
            <div class="pull-left">
                <img src="<?= $framewotk->UrlContent('/Themes/Jasminum.Theme/Styles/Images/hall-4.jpg'); ?>">
                Grill/ogród dostępny/zarezerwowany
            </div>
        </div>
    </div>
    <div id="jasminum-calendar">
        <div id="jasminum-calendar-days-names" class="clearfix">
            <div><h3>Pn</h3></div>
            <div><h3>Wt</h3></div>
            <div><h3>Śr</h3></div>
            <div><h3>Cw</h3></div>
            <div><h3>Pt</h3></div>
            <div><h3>Sb</h3></div>
            <div><h3>Nd</h3></div>
        </div>
        <div class="jasminum-calendar-days clearfix" id="jasminum-calendar-days">
            <div id="jasminum-calendar-month"><?= $calendar->generateCalendarView(); ?></div>
            <div id="ajaxLoader">
                Ładowanie zawartości <img src="<?= $framewotk->UrlContent('/Themes/Jasminum.Theme/Styles/Images/ajax-loader.gif'); ?>">
            </div>
            <div class="beautyLeft"></div>
            <div class="beautyRight"></div>
            <div id="navigator">
                <div id="navigatorMonths" class="clearfix">
                    <div id="monthPrevious"></div>
                    <div id="month"></div>
                    <div id="monthNext"></div>
                </div>
                <div id="navigatorYears" class="clearfix">
                    <div id="yearPrevious"></div>
                    <div id="year"></div>
                    <div id="yearNext"></div>
                </div>
            </div>
        </div>
    </div>
    <div id="jasminum-calendar-info">
        <header>
            Chcesz zarezerwować salę na wybrany termin?
        </header>
        <ul>
            <li class="phone">Zadzwoń: 22 123 23 23, 321 321 321</li>
            <li class="email">Napisz: rezerwacje@jasminum.pl</li>
            <li class="form">Skorzystaj z formularza kontaktowego w dziale <a title="Kontakt" href="<?= $framewotk->UrlContent('/kontakt'); ?>">kontakt</a>.</li>
        </ul>
    </div>
    <script>
        // Calendar handler
        $(document).ready(function() {
            // Months navigator
            var date = new Date();
            var currentMonthNumber = date.getMonth();
            currentMonthNumber++; // In JS January = 0
            var currentYearNumber = date.getFullYear();

            $('#year').html('<h4>' + currentYearNumber + '</h4>');
            monthNavigatorSetter(currentMonthNumber);

            // Attach click event to pointers
            $('#monthPrevious').click(function() {
                // Some fireworks!
                $('#jasminum-calendar-month').fadeOut();
                $('#ajaxLoader').show();

                if(currentMonthNumber === 0) {
                    currentMonthNumber = 13; // We deduct 1 in Ajax call
                }

                $.ajax({
                    url: '<?=$framewotk->UrlContent('/JasminumCalendar/GetMonth'); ?>',
                    type: 'post',
                    data: {currentMonthNumber: currentMonthNumber - 1, currentYearNumber: currentYearNumber}
                }).done(function(data) {
                    $('#ajaxLoader').hide();
                    $('#jasminum-calendar-month').html(data).fadeIn();

                    // New value
                    currentMonthNumber--;

                    if(currentMonthNumber <= 0) {
                        currentMonthNumber = 12; // We deduct 1 in Ajax call
                    }

                    // Set new month to navigator
                    monthNavigatorSetter(currentMonthNumber);
                });
            });

            $('#yearPrevious').click(function() {
                // Some fireworks!
                $('#jasminum-calendar-month').fadeOut();
                $('#ajaxLoader').show();

                $.ajax({
                    url: '<?=$framewotk->UrlContent('/JasminumCalendar/GetMonth'); ?>',
                    type: 'post',
                    data: {currentMonthNumber: currentMonthNumber, currentYearNumber: currentYearNumber - 1}
                }).done(function(data) {
                    $('#ajaxLoader').hide();
                    $('#jasminum-calendar-month').html(data).fadeIn();

                    // New value
                    currentYearNumber--;

                    $('#year').html('<h4>' + currentYearNumber + '</h4>');
                    Cufon.refresh();
                });
            });

            $('#monthNext').click(function() {
                // Some fireworks!
                $('#jasminum-calendar-month').fadeOut();
                $('#ajaxLoader').show();

                if(currentMonthNumber === 13) {
                    currentMonthNumber = 0; // We deduct 1 in Ajax call
                }

                $.ajax({
                    url: '<?= $framewotk->UrlContent('/JasminumCalendar/GetMonth'); ?>',
                    type: 'post',
                    data: {currentMonthNumber: currentMonthNumber + 1, currentYearNumber: currentYearNumber}
                }).done(function(data) {
                    $('#ajaxLoader').hide();
                    $('#jasminum-calendar-month').html(data).fadeIn();

                    // New value
                    currentMonthNumber++;

                    if(currentMonthNumber >= 13) {
                        currentMonthNumber = 1; // We deduct 1 in Ajax call
                    }

                    // Set new month to navigator
                    monthNavigatorSetter(currentMonthNumber);
                });
            });

            $('#yearNext').click(function() {
                // Some fireworks!
                $('#jasminum-calendar-month').fadeOut();
                $('#ajaxLoader').show();

                $.ajax({
                    url: '<?= $framewotk->UrlContent('/JasminumCalendar/GetMonth'); ?>',
                    type: 'post',
                    data: {currentMonthNumber: currentMonthNumber, currentYearNumber: currentYearNumber + 1}
                }).done(function(data) {
                    $('#ajaxLoader').hide();
                    $('#jasminum-calendar-month').html(data).fadeIn();

                    // New value
                    currentYearNumber++;

                    $('#year').html('<h4>' + currentYearNumber + '</h4>');
                    Cufon.refresh();
                });
            });

            // Description tooltip
            $('.hallReserved-0, .hallReserved-1, .hallReserved-2, .hallReserved-3').hover(function() {
                $(this).find('.eventDescription').fadeIn();
            }, function() {
                $(this).find('.eventDescription').fadeOut();
            });

            // We have to attach hover event once again for
            // dynamically created elements
            $('#jasminum-calendar-days').on({
                mouseenter: function() {
                    $(this).find('.eventDescription').fadeIn();
                },
                mouseleave: function() {
                    $(this).find('.eventDescription').fadeOut();
                }
            }, '.hallReserved-0, .hallReserved-1, .hallReserved-2, .hallReserved-3');
        });

        var monthNavigatorSetter = function(currentMonthNumber) {
            var currentMonth;

            switch(currentMonthNumber) {
                case 1:
                    currentMonth = 'Styczeń';
                    break;
                case 2:
                    currentMonth = 'Luty';
                    break;
                case 3:
                    currentMonth = 'Marzec';
                    break;
                case 4:
                    currentMonth = 'Kwiecień';
                    break;
                case 5:
                    currentMonth = 'Maj';
                    break;
                case 6:
                    currentMonth = 'Czerwiec';
                    break;
                case 7:
                    currentMonth = 'Lipiec';
                    break;
                case 8:
                    currentMonth = 'Sierpień';
                    break;
                case 9:
                    currentMonth = 'Wrzesień';
                    break;
                case 10:
                    currentMonth = 'Październik';
                    break;
                case 11:
                    currentMonth = 'Listopad';
                    break;
                case 12:
                    currentMonth = 'Grudzień';
                    break;
            }

            $('#month').html('<h3>' + currentMonth + '</h3>');
            Cufon.refresh();
        }
    </script>